<template>
    <div>
      <h1>医生列表</h1>
      <div>
        医生名称:<input type="text" v-model="query.doctorname"/>
        职称名称:
                    <select v-model="query.positionname">
                        <option value="">请选择</option>
                        <option value="主任">主任</option>
                        <option value="主治医师">主治医师</option>
                        <option value="护士">护士</option>
                    </select>
        <input type="button" value="查询" class="btn btn-primary" @click="showw"/>
      </div>
      <table class="table table-bordered">
        <tbody>
            <tr>
                <td>ID</td>
                <td>医生名称</td>
                <td>医生图片</td>
                <td>科室名称</td>
                <td>学历</td>
                <td>职称</td>
                <td>第一职业医院</td>
                <td>是否开通账号</td>
                <td>操作</td>
            </tr>
            <tr v-for="item in data.list">
                <td>{{item.doctorId}}</td>
                <td>{{item.doctorName}}</td>
                <td><img :src="item.doctorImg" width="50px" height="70px" /></td>
                <td>{{item.departmentName}}</td>
                <td>{{item.edubackground}}</td>
                <td>{{item.positionName}}</td>
                <td>{{item.hospitalName}}</td>
                <td>{{item.isNoRome==0?"已开通":"未开通"}}</td>
                <td>
                    <input type="button" value="删除" class="btn btn-danger" @click="del(item.doctorId)" />
                    <input type="button" value="详情" class="btn btn-warning" @click="Discount(item.doctorId)" />
                </td>
            </tr>
        </tbody>
      </table>
      <div>
        <span>每页显示{{ query.pageSize }}条/共{{ data.totalCount }}条</span>
        <span>当前第{{ query.pageIndex }}条/共{{ data.totalPage }}页</span>
        <input type="button" value="首页" @click="Gopage(1)"/>
        <input type="button" value="上一页" @click="Gopage(query.pageIndex-1)"/>
        <span v-for="item in data.totalPage" @click="Gopage(item)">{{ item }}</span>
        <input type="button" value="下一页" @click="Gopage(query.pageIndex+1)"/>
        <input type="button" value="尾页" @click="Gopage(data.totalPage)"/>
      </div>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref,reactive,onMounted } from 'vue';
import moment from 'moment';
import { useRoute,useRouter } from 'vue-router';
//接收值
const route=useRoute();
//跳转页面
const router=useRouter();

let query:any=reactive
({
    pageIndex:1,
    pageSize:3,
    doctorname:'',
    positionname:''
})

let data:any=reactive
({
    totalCount:'',
    totalPage:'',
    list:[]
})
onMounted(()=>{
    showlist();
})
const showw=()=>
{
    query.pageIndex=1;
    showlist();
}
//显示医生列表
const showlist=()=>
{
    axios
    ({
        url:'/api/Doctor/ShowDoctor',
        method:'get',
        params:query
    })
    .then(res=>{
        console.log(res);
        Object.assign(data,res.data);
    })
    .catch(err=>{
       console.log(err);
    })
}
//分页
const Gopage=(num:any)=>
{
    if(num<1)
    {
        query.pageIndex=1;
        return;
    }
    if(num>data.totalPage)
    {
        query.pageIndex=data.totalPage;
        return;
    }
    query.pageIndex=num;
    showlist();
}

const del=(id:any)=>
{
    let f=confirm("确认删除吗?")
  {
    if(f)
    {
      axios
      ({
          url:'/api/Doctor/DoctorDelete',
          method:'delete',
          params:
          {
            id:id
          }
      })
      .then(res=>{
          console.log(res);
          if(res.data>0)
          {
              alert("删除成功");
              showlist();
              return;
          }
          else
          {
              alert("删除失败");
              return;
          }
          
      })
      .catch(err=>{
          console.log(err);
          
      })
    }
  }
}

const Discount=(id:any)=>
{
    router.push
    ({
        path:'/doctordiscount',
        query:
        {
            id:id
        }
    })
}

</script>

<style scoped>
span
{
    margin: 0 10px;
}
input
{
    margin: 0 10px;
}
</style>